<template>
    <div>
        <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
            <el-tab-pane label="满意度指标" name="first">
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-card shadow="always" class="detail-card" header="区县满意度表现值">
                            <el-table class="table_wrap" :data="tableData12">
                                <!-- <el-table-column type="index" width="50" label="#" align="center" /> -->
                                <el-table-column prop="county" label="区县" width="120" align="center" />
                                <el-table-column prop="complaintCount" label="综合满意度" width="150" align="center" />
                                <el-table-column prop="lteSurfCount" label="移动业务满意度" width="150" align="center" />
                                <el-table-column prop="volteCount" label="网络质量" align="center" />
                                <el-table-column prop="volteCount" label="语音质量" align="center" />
                                <el-table-column prop="volteCount" label="上网质量" align="center" />
                            </el-table>


                        </el-card>
                    </el-col>
                    <el-col :span="12">
                        <el-card shadow="always" class="detail-card" header="区县满意度领先值">
                            <el-table class="table_wrap" :data="tableData12">
                                <!-- <el-table-column type="index" width="50" label="#" align="center" /> -->
                                <el-table-column prop="county" label="区县" width="120" align="center" />
                                <el-table-column prop="complaintCount" label="综合满意度" width="150" align="center" />
                                <el-table-column prop="lteSurfCount" label="移动业务满意度" width="150" align="center" />
                                <el-table-column prop="volteCount" label="网络质量" align="center" />
                                <el-table-column prop="volteCount" label="语音质量" align="center" />
                                <el-table-column prop="volteCount" label="上网质量" align="center" />
                            </el-table>

                        </el-card>
                    </el-col>
                </el-row>
                <el-row :gutter="20" style="margin-top: 10px;">
                    <el-col :span="12">
                        <el-card shadow="always" class="detail-card" header="地市满意度表现值">
                            <el-table class="table_wrap" :data="tableData12">
                                <!-- <el-table-column type="index" width="50" label="#" align="center" /> -->
                                <el-table-column prop="county" label="地市" width="120" align="center" />
                                <el-table-column prop="complaintCount" label="综合满意度" width="150" align="center" />
                                <el-table-column prop="lteSurfCount" label="移动业务满意度" width="150" align="center" />
                                <el-table-column prop="volteCount" label="网络质量" align="center" />
                                <el-table-column prop="volteCount" label="语音质量" align="center" />
                                <el-table-column prop="volteCount" label="上网质量" align="center" />
                            </el-table>

                        </el-card>
                    </el-col>
                    <el-col :span="12">
                        <el-card shadow="always" class="detail-card" header="地市满意度领先值">
                            <el-table class="table_wrap" :data="tableData12">
                                <el-table-column prop="county" label="地市" width="120" align="center" />
                                <el-table-column prop="complaintCount" label="综合满意度" width="150" align="center" />
                                <el-table-column prop="lteSurfCount" label="移动业务满意度" width="150" align="center" />
                                <el-table-column prop="volteCount" label="网络质量" align="center" />
                                <el-table-column prop="volteCount" label="语音质量" align="center" />
                                <el-table-column prop="volteCount" label="上网质量" align="center" />
                            </el-table>

                        </el-card>
                    </el-col>
                </el-row>
                <el-row :gutter="20">

                </el-row>
            </el-tab-pane>
            <el-tab-pane label="低满修复" name="second">


            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script setup name="satisfaction">

const activeName = ref("first")



</script>